/*
  1. 解析 URL 合法性
    合法 - 下一步
    不合法 - 出错

  2. 判断是否命中强制缓存
    命中 - 直接读取缓存 
    没有命中 - 下一步


  3. DNS查询（解析）
    将域名地址解析成ip地址

    4个缓存 1个递归查询
      从近到远：
        - 查询浏览器DNS缓存，找到返回ip地址
        - 查询计算机DNS缓存，找到返回ip地址
        - 查询路由器DNS缓存，找到返回ip地址
        - 查询网络运营商DNS缓存，找到返回ip地址

      根域名服务器查询
        a.b.c.com -> .com -> c.com -> b.c.com -> a.b.c.com
        找到返回，没找到失败

  4. TCP连接 - TCP三次握手
    为什么需要三次握手？
      为了确保双方的收发能力是正常的
    三次握手细节？
      第一次握手：客户端发送给服务器数据包，服务器确定客户端发送能力正常
      第二次握手：服务器发送给客户端数据包，客户端确定服务器接受和发送能力都正常
      第三次握手：客户端发送给服务器数据包，服务器确定客户端接受能力正常

  5. 发送请求
    客户端将请求报文发送给服务器

  6. 接受响应
    服务器处理请求，返回响应报文
    
  7. 解析渲染
    得到 index.html 页面

    浏览器调用html解析器解析html元素，解析成DOM树。
    调用css解析器解析css代码，解析成CSSOM树。
    将DOM树和CSSOM树合并，生成render树
    根据render树进行布局（layout）和渲染（paint）
      布局：计算大小，位置
      渲染：将颜色绘制上去

    遇到js会阻塞渲染，等js加载解析完成继续渲染。
      如果操作了DOM元素，重新生成DOM树
      如果操作了CSS样式，重新生成CSSOM树
      将DOM树和CSSOM树合并，生成render树
      根据render树进行布局（layout）和渲染（paint） -> 重排重绘

    重排一定会导致重绘，重绘不一定导致重排
    
      减少重排重绘
        读取元素width、height等信息，会触发重排重绘。尽量缓存使用

      让重排重绘限制在最小区域，而不是整个页面的重排重绘
        canvas 画布
        开启3d硬件加速 transform: translateZ(0);

  8. 断开链接：TCP四次挥手
    为什么需要四次挥手？
      为了双方数据都发送或接受完毕，才能断开链接
    四次挥手细节？
      第一次挥手：客户端发送给服务器数据包，请求报文数据发送完毕
      第二次挥手：服务器发送给客户端数据包，请求报文数据接受完毕
      第三次挥手：服务器发送给客户端数据包，响应报文数据发送完毕
      第四次挥手：客户端发送给服务器数据包，响应报文数据接受完毕 
        客户端会延迟一段时间断开链接，服务器接受到数据包断开链接

    https://www.yuque.com/xpromise/interview/fomgci9679lqskx5#c399680b
*/
